<template>
  <div class="app-container">
    <!-- 选择客户弹窗测试 -->
    <el-dialog :title="titlekh" :visible.sync="openkh" width="1000px" append-to-body>
      <el-form :model="queryParamsKh" ref="queryFormKh" size="small" :inline="true" label-width="68px"
        @submit.native.prevent>
        <el-form-item label="客户名称" prop="customer">
          <el-input v-model="queryParamsKh.customer" placeholder="请输入客户名称" clearable v-on:input="handleKhQuery"
            @keyup.enter.native="handleKhQuery" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleKhQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQueryKh">重置</el-button>
        </el-form-item>
      </el-form>
      <el-form label-width="80px">
        <el-table v-loading="loading" style="overflow: auto; " height="400px" :data="khList"
          @selection-change="handleSelectionChangeKh" @row-click="handleClickTableRowA" ref="fileTableA">
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="客户编号" align="center" prop="customerIdHw" v-if="false"/>
          <el-table-column label="客户名称" align="center" prop="customer" />
          <el-table-column label="帐号" align="center" prop="accountName" />
          <el-table-column label="新客类型" width="80" align="center" prop="customerTagType" />
          <el-table-column label="新客标签" width="80" align="center" prop="newCustomerTag">
            <template slot-scope="scope">
              <span v-if="scope.row.newCustomerTag == 'Y'" style="color: green;">合格新客</span>
              <span v-if="scope.row.newCustomerTag == 'N'" style="color: red;">非新客</span>
              <span v-if="scope.row.newCustomerTag == 'UNDETERMINED'" style="color: chocolate;">未达标</span>
            </template>
          </el-table-column>
          <el-table-column label="生效月份" width="80" align="center" prop="effectiveTime" />
          <el-table-column label="失效月份" width="80" align="center" prop="expireTime" />
        </el-table>
        <pagination v-show="totalkh > 0" :total="totalkh" :page.sync="queryParamsKh.pageNum"
          :limit.sync="queryParamsKh.pageSize" @pagination="getListKh" />
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="khClick">确 定</el-button>
        <el-button @click="khcancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listCustomerinfo } from "@/api/CustomerinfoMain/customerinfo";
export default {
  name: "orderxx",
  props: {

  },
  data() {
    return {
      loading: true,
      deid: [],//分配选中的渠道
      dename: [],

      realDea: [], //实际渠道-选择客户时，赋值
      sjname: [], //实际名称-选择客户时，赋值
      //分配客户相关--------------------
      openkh: false,
      titlekh: "",
      khList: [],
      totalkh: 0,
      khid: [],
      khmc: [],
      // 查询参数
      queryParamsKh: {
        pageNum: 1,
        pageSize: 10,
        customer: null,
        verifiedStatus: 2,
      },
    };
  },

  created() {


  },
  methods: {
    /** 选择客户相关事件 */
    show1() {
      this.openkh = true;
      this.titlekh = "选择客户";
      this.getListKh();
    },
    khcancel() {
      this.openkh = false;
    },
    /** 搜索按钮操作 */
    handleKhQuery() {
      this.getListKh();
    },
    handleClickTableRowA(row, event, column) {
      this.$refs.fileTableA.toggleRowSelection(row);
    },
    /**分配客房窗口重置 */
    resetQueryKh() {
      this.resetForm("queryFormKh");
      this.handleKhQuery();
    },
    /** 分配客户多选框选中数据1 客户*/
    handleSelectionChangeKh(selection) {
      this.khid = selection.map(item => item.customerIdHw)
      this.khmc = selection.map(item => item.customer)

      this.deid = selection.map(item => item.deaId), //归属渠道element.realDea;
        this.dename = selection.map(item => item.deaName), //归属名称

        this.realDea = selection.map(item => item.realDea), // realDea;
        this.sjname = selection.map(item => item.realDeaName), //实际名称
        // console.log(this.dename)
        // console.log(this.sjname)
        this.single = selection.length !== 1
      this.multiple = !selection.length

    },
    /** 查询分配客户列表 */
    getListKh() {

      // if(this.form2.khname!=null)
      // this.queryParamsKh.customer=this.form2.khname;
      listCustomerinfo(this.queryParamsKh).then(response => {
        this.totalkh = response.total;
        this.khList = response.rows;
        this.loading = false;
      });
    },
    /** 分配客户操作 */
    khClick() {
      if (this.khid.length > 1) {
        this.$modal.msgWarning("只能选择一个客户");
        return;
      }
      // this.form2.customerId = this.khid[0];
      // this.form2.khname = this.khmc[0];

      // this.form2.deaId = this.deid[0];
      // this.form2.gsname = this.dename[0];
      // //没有实际渠道，取归属渠道
      // if (this.realDea == '' || this.realDea == null) {
      //   this.form2.realDea = this.deid[0];
      //   this.form2.sjname = this.dename[0];
      // }
      // else {
      //   this.form2.realDea = this.realDea[0];
      //   this.form2.sjname = this.sjname[0];
      // }
      this.$nextTick(() => {
        this.$emit("okkh", this.khid[0], this.khmc[0], this.deid[0], this.dename[0], this.realDea[0], this.sjname[0]);
      });

      this.khcancel();
    },
  },
};
</script>
